import React from 'react'
import './Mine.less'
import { List } from 'antd-mobile';
import Icon from '@/components/font'
const Item = List.Item;
const Brief = Item.Brief;

export default function Mine() {
  return (
    <div className="mine-wrapper">
      <List>
        <Item arrow="horizontal" thumb={<div className="chat-thumb">胜龙</div>} >
          Title <Brief>subtitle</Brief>
        </Item>
      </List>
      <section className="payment-sec">
        <List>
          <Item
              thumb={<Icon type="icon-safety-certificate" />}
              arrow="horizontal"
              onClick={() => {}}
            >支付</Item>
        </List>
      </section>
      <section className="more-sec"> 
        <List>
          <Item
              thumb={<Icon type="icon-database-set" />}
              arrow="horizontal"
              onClick={() => {}}
              multipleLine
            >收藏</Item>
          <Item
              thumb={<Icon type="icon-picture" />}
              arrow="horizontal"
              onClick={() => {}}
              multipleLine
            >相册</Item>
          <Item
              thumb={<Icon type="icon-layergroup-fill" />}
              arrow="horizontal"
              onClick={() => {}}
              multipleLine
            >卡包</Item>
        </List>
      </section>
    </div>
  )
}
